
const { ccclass, property } = cc._decorator;

let ActTime = 0.2 // 秒，动画时间

@ccclass
export default class SwitchBtnCpnt extends cc.Component {
    ndOn: cc.Node;
    ndOnFlag: cc.Node;
    ndOff: cc.Node;
    ndOffFlag: cc.Node;
    private _offPos: cc.Vec3;
    private _onPos: cc.Vec3;
    private _isOn: boolean;

    onLoad() {
        cc.log(`${cc.js.getClassName(this)} onLoad`)

        this.ndOn = cc.find(`on`, this.node)
        this.ndOnFlag = cc.find(`flag`, this.ndOn)
        this.ndOff = cc.find(`off`, this.node)
        this.ndOffFlag = cc.find(`flag`, this.ndOff)

        this._onPos = this.ndOnFlag.position
        this._offPos = this.ndOffFlag.position

        this.init(true)
    }

    init(isOn: boolean): boolean {
        cc.log(`${cc.js.getClassName(this)} init isOn = ${isOn}`)

        this._isOn = isOn
        this.ndOnFlag.position = this._onPos
        this.ndOffFlag.position = this._offPos
        if (this._isOn) {
            this.ndOn.opacity = 255
            this.ndOnFlag.opacity = 255
            this.ndOff.opacity = 0
            this.ndOffFlag.opacity = 0
        } else {
            this.ndOn.opacity = 0
            this.ndOnFlag.opacity = 0
            this.ndOff.opacity = 255
            this.ndOffFlag.opacity = 255
        }

        return this._isOn
    }

    switchBtn(actTime: number = ActTime): boolean {
        this._isOn = !this._isOn
        cc.log(`${cc.js.getClassName(this)} switchBtn ${this._isOn} actTime = ${actTime}`)

        if (this._isOn) {
            this.ndOn.active = true
            this.ndOn.opacity = 0
            this.ndOnFlag.active = true
            this.ndOnFlag.position = this._offPos
            this.ndOnFlag.opacity = 0

            this.ndOff.active = true
            this.ndOff.opacity = 255
            this.ndOffFlag.active = true
            this.ndOffFlag.position = this._offPos
            this.ndOffFlag.opacity = 255

            cc.tween(this.ndOn)
                .to(actTime, { opacity: 255 })
                .call(() => {
                    this.ndOn.opacity = 255
                })
                .start()
            cc.tween(this.ndOnFlag)
                .to(actTime, { position: this._onPos, opacity: 255 })
                .call(() => {
                    this.ndOnFlag.position = this._onPos
                    this.ndOnFlag.opacity = 255
                })
                .start()

            cc.tween(this.ndOff)
                .to(actTime, { opacity: 0 })
                .call(() => {
                    this.ndOff.opacity = 0
                })
                .start()
            cc.tween(this.ndOffFlag)
                .to(actTime, { position: this._onPos, opacity: 0 })
                .call(() => {
                    this.ndOffFlag.position = this._onPos
                    this.ndOffFlag.opacity = 0
                })
                .start()
        } else {
            this.ndOn.opacity = 255
            this.ndOnFlag.position = this._onPos
            this.ndOnFlag.opacity = 255

            this.ndOff.opacity = 0
            this.ndOffFlag.position = this._onPos
            this.ndOffFlag.opacity = 0

            cc.tween(this.ndOn)
                .to(actTime, { opacity: 0 })
                .call(() => {
                    this.ndOn.opacity = 0
                })
                .start()
            cc.tween(this.ndOnFlag)
                .to(actTime, { position: this._offPos, opacity: 0 })
                .call(() => {
                    this.ndOnFlag.position = this._offPos
                    this.ndOnFlag.opacity = 0
                })
                .start()

            cc.tween(this.ndOff)
                .to(actTime, { opacity: 255 })
                .call(() => {
                    this.ndOff.opacity = 255
                })
                .start()
            cc.tween(this.ndOffFlag)
                .to(actTime, { position: this._offPos, opacity: 255 })
                .call(() => {
                    this.ndOffFlag.position = this._offPos
                    this.ndOffFlag.opacity = 255
                })
                .start()
        }

        return this._isOn
    }

    isOn(): boolean {
        cc.log(`${cc.js.getClassName(this)} isOn = ${this._isOn}`)

        return this._isOn
    }
}
